<%@ page import="org.bson.Document" %>
<%@ page import="com.mongodb.client.*" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>Mongo-Web学生管理系统</title>
    <!-- 引入 layui.css -->
    <!-- 引入 layui.css -->
    <link href="http:////unpkg.com/layui@2.7.6/dist/css/layui.css" rel="stylesheet">


</head>

<body>

<%
    String url = "mongodb://g08:abc%408@mongo.zhledu.cn:27017/g08";
    MongoClient client = MongoClients.create(url);
    MongoIterable<String> names = client.listDatabaseNames();
    MongoDatabase g08 = client.getDatabase("g08");
    MongoCollection<Document> collection = g08.getCollection("student");
    final FindIterable<Document> list = collection.find().limit(100);
%>

<div class="layui-fluid">
    <div class="layui-row" style="background-color: #1e9fff;height: 50px;margin-top: 20px;margin-bottom: 10px;">
        <div class="layui-col-md4 layui-col-md-offset4">
            <h1>欢迎使用学生信息管理系统</h1>
        </div>
        <div class="layui-col-md4"></div>
    </div>
    <form class="layui-form">

        <div class="layui-form-item">

            <label class="layui-form-label">学号:</label>
            <div class="layui-input-inline">
                <input type="text" name="sno" required lay-verify="required" placeholder="请输入学号" autocomplete="off"
                       class="layui-input layui-input-inline">
            </div>
            <label class="layui-form-label">姓名:</label>
            <div class="layui-input-inline">
                <input type="text" name="name" required lay-verify="required" placeholder="请输入姓名" autocomplete="off"
                       class="layui-input layui-input-inline">
            </div>
            <label class="layui-form-label">身份证号:</label>
            <div class="layui-input-inline">
                <input type="text" name="idCard" required lay-verify="required" placeholder="请输入身份证号"
                       autocomplete="off"
                       class="layui-input layui-input-inline">
            </div>
            <label class="layui-form-label">性别:</label>
            <div class="layui-input-inline">
                <select name="sex" lay-verify="">
                    <option value="">==请选择==</option>
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
            </div>
            <label class="layui-form-label">专业:</label>
            <div class="layui-input-inline">
                <select name="major" lay-verify="">
                    <option value="">==请选择==</option>
                </select>
            </div>
            <div class="layui-input-inline">
                <button class="layui-btn  layui-icon layui-icon-search" type="submit">查找</button>
                <button class="layui-btn layui-btn-danger layui-icon layui-icon-refresh" type="reset">重置</button>
            </div>
        </div>


    </form>
    <br>
    <div class="layui-btn-group" style="margin-top: 15px;margin-bottom: 15px;">
        <button class="layui-btn layui-icon layui-icon-add-1">添加</button>
        <button class="layui-btn layui-btn-danger layui-icon layui-icon-delete">删除</button>
        <button class="layui-btn layui-btn-warm layui-icon layui-icon-export">导出</button>
        <button class="layui-btn layui-btn-normal layui-icon layui-icon-return">导出</button>
        <button class="layui-btn layui-icon layui-icon-print">打印</button>
    </div>

    <table class="layui-table">
        <thead>
        <th>
            <input type="checkbox" id="checkAll">全选
        </th>
        <th>学号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>身份证号</th>
        <th>手机</th>
        <th>操作</th>
        </thead>
        <%
            for (Document student : list) {
                int id = student.getInteger("_id");
        %>
        <tr>
            <td>
                <input type="checkbox" id="<%=id%>" value="<%=id%>">
            </td>
            <td><%=student.getString("sno")%>
            </td>
            <td><%=student.getString("name")%>
            </td>
            <td><%=student.getInteger("age")%>
            </td>
            <td><%=student.getString("sex")%>
            </td>
            <td><%=student.getString("idCard")%>
            </td>
            <td><%=student.getString("phone")%>
            </td>
            <td>
                <a href="#">查看</a> | <a href="#">修改</a> | <a href="#">删除</a> | <a href="#">打印</a>

            </td>
        </tr>

        <%
            }
        %>
    </table>
</div>
<!-- 引入 layui.js -->
<script src="http://unpkg.com/layui@2.7.6/dist/layui.js"></script>
<script>
    layui.use(['layer', 'form'], function () {
        var layer = layui.layer;
        var form = layui.form;

        console.log(layui.$.fn.jquery);
    });
</script>
</body>
</html>